{% load i18n %}
<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Metatags -->
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <title>{% block title %}{% endblock %}</title>

    <!-- Stylesheets -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous" />
    {% block stylesheets %}{% endblock %}
  </head>
  <body>
    <section>
      <header><h1 class="sr-only">Wapyce</h1></header>
      <nav class="navbar navbar-inverse navbar-static-top">
        <div class="container-fluid">
          <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false">
              <span class="sr-only">{% trans "Toggle navigation" %}</span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">Wapyce</a>
          </div>
          <div class="collapse navbar-collapse" id="navbar-collapse">
            <ul class="nav navbar-nav navbar-right">
              <li><a href="{% url 'home' %}">{% trans "Home page" %}</a></li>
              <li><a href="{% url 'list_validations' %}">{% trans "Validations submited" %}</a></li>
              <li><a href="{% url 'donate' %}">{% trans "Donate" %}</a></li>
              <li><a href="https://github.com/wapyce/wapyce">Github</a></li>
              {% if not user.is_authenticated %}
                <li><a href="{% url 'social:begin' 'github' %}{% if request.GET.next %}?next={{ request.GET.next }}{% endif %}">{% trans "Login with Github" %}</a></li>
              {% else %}
                <li class="dropdown">
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                    {% trans "Account" %} <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a href="{% url 'settings' %}">{% trans "Settings" %}</a></li>
                    <li><a href="{% url 'logout' %}">{% trans "Logout" %}</a></li>
                  </ul>
                </li>
              {% endif %}
            </ul>
          </div>
        </div>
      </nav>
      {% if messages %}
        <hr class="sr-only" />
        <div>
          <ul class="messages">
            {% for message in messages %}
              <li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>
            {% endfor %}
          </ul>
        </div>
      {% endif %}
      <hr class="sr-only" />
      <div class="container-fluid">
        {% block content %}{% endblock %}
      </div>
      <hr class="sr-only" />
      <footer class="container-fluid">
        <div class="row">
          <div class="col-md-10 col-md-offset-1">
            <p class="well">{% trans "Copyright (c) 2018 Wapyce" %}</p>
          </div>
        </div>
      </footer>
    </section>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
  </body>
</html>
